﻿<div id="login">
    <div class="container">
        <div class="page-header">
            <h1>Login to your account   <small>use your site credentials or any of the external providers allowed</small></h1>
        </div>
        <div class="row" data-bind="visible: !appsecurity.user().IsAuthenticated">
            <div class="col-lg-6">
                <form class="form-horizontal">
                    <div class="page-header">
                        <h4>Sign in with your credentials</h4>
                    </div>
                    <div class="form-group" data-bind="validationElement: username">
                        <label class="control-label col-lg-4" for="username">Username</label>
                        <div class="col-lg-8">
                            <input class="form-control" type="text" data-bind="value: username" placeholder="User name">
                        </div>
                    </div>
                    <div class="form-group" data-bind="validationElement: password">
                        <label class="control-label col-lg-4" for="email">Password</label>
                        <div class="col-lg-8">
                            <input class="form-control" type="password" data-bind="value: password" placeholder="Password">
                        </div>
                    </div>
                    <div class="checkbox col-lg-offset-4">
                        <label class="checkbox">
                            <input type="checkbox" data-bind="value: rememberMe">Remember me
                        </label>
                    </div>
                    <div class="col-lg-offset-4 mart2">
                        <button type="submit" class="btn btn-primary" data-bind="click: login">Sign in</button>
                        <button type="reset" class="btn btn-default">Reset</button>
                        <p class="mart5"> <a href="#" class="btn btn-link" data-bind="attr: { href: convertRouteToHash('/account/register') }">Register</a>if don't have and account?</p>
                    </div>
                </form>
            </div>

            <div class="col-offset-1 col-lg-5">
                <div class="page-header">
                    <h4>... or you can sign in using another service</h4>
                </div>
                <div class="list-group" data-bind="foreach: appsecurity.externalLogins">
                    <a class="list-group-item lead" href="#" data-bind="click: function (data, event) { $parent.externalLogin($parent, data, event) }, attr: { 'data-provider': Provider }">
                        <i data-bind="css: $parent.socialIcon($data)"></i>
                        <span data-bind="text: ProviderDisplayName"></span>
                    </a>
                </div>
            </div>
        </div>

        <div class="jumbotron" data-bind="visible: appsecurity.user().IsAuthenticated && !isRedirect()">
            <h2>You are actually logged in</h2>
            <a class="btn btn-primary" data-bind="click : logout">Logout</a>
        </div>
        <div class="jumbotron" data-bind="visible: appsecurity.user().IsAuthenticated && isRedirect()">
            <h2>You are actually logged in but cannot access this route with your current permissions</h2>
            <p class="lead">Sign out and enter again the credentials with the correct permissions</p>
            <a class="btn btn-primary" data-bind="click: logout">Logout</a>
        </div>
    </div>
</div>